<style>

</style>
<template>
    <div>
        <Row>
            <Card>
                <div class="top-tool-bar">
                    <Select v-model="model1" style="width:150px" placeholder="请选择省份">
                        <Option v-for="item in cityList" :value="item.value" :key="item.value">{{ item.label }}</Option>
                    </Select>

                    <Select v-model="model1" style="width:150px" placeholder="请选择城市" >
                        <Option v-for="item in cityList" :value="item.value" :key="item.value">{{ item.label }}</Option>
                    </Select>

                    <Select v-model="model1" style="width:150px" placeholder="请选择地区" >
                        <Option v-for="item in cityList" :value="item.value" :key="item.value">{{ item.label }}</Option>
                    </Select>

                    <Select v-model="model1" style="width:150px" placeholder="请选择站点" >
                        <Option v-for="item in cityList" :value="item.value" :key="item.value">{{ item.label }}</Option>
                    </Select>

                    <Select v-model="model1" style="width:150px" placeholder="请选择名称">
                        <Option v-for="item in cityList" :value="item.value" :key="item.value">{{item.label }}</Option>
                    </Select>

                    <Input v-model="value" placeholder="请输入巡检人姓名" style="width: 150px;padding-left: 3px"></Input>
                    <Button type="primary" icon="ios-search" loading>搜索</Button>
                </div>
                <Form :model="list" label-position="right" :label-width="80" inline>
                    <FormItem label="查询条件">
                        <Select v-model="model1" style="width:150px">
                            <Option value="年" key="年"></Option>
                            <Option value="月" key="月"></Option>
                            <Option value="日" key="日"></Option>
                        </Select>
                    </FormItem>
                    <FormItem label="时间">
                        <Select v-model="model1" style="width:150px">
                            <Option value="年" key="年"></Option>
                            <Option value="月" key="月"></Option>
                            <Option value="日" key="日"></Option>
                        </Select>
                    </FormItem>
                    <Button type="primary" icon="checkmark-circled">确定</Button>
                    <Button type="primary" icon="ios-trash">删除</Button>
                    <Button type="primary" icon="plus-circled" @click.prevent.stop="goToAdd()">录入</Button>
                </Form>
                <Table border :columns="columns2" :data="data2"></Table>
                <page :total="100" show-elevator show-sizer @on-change="changePage" @on-page-size-change="changeSize"></page>
            </Card>
        </Row>
    </div>
</template>
<script type="text/ecmascript-6">
    import api from '@/libs/util';
    export default {
        data () {
            return {
                value: '',
                list: {},
                cityList: [
                    {
                        value: '',
                        label: ''
                    }
                ],
                model1: '',
                size:10,
                num:1,
                total: [],
                selectedDataId:'',
                multipleDataId: [],
                columns2: [
                    {
                        type: 'selection',
                        width: 60,
                        align: 'center'
                    },
                    {
                        title: '巡检时间',
                        key: 'time'
                    },
                    {
                        title: '巡检情况',
                        key: 'result'
                    },
                    {
                        title: '巡检人',
                        key: 'name'
                    },
                    {
                        title: '巡检班组',
                        key: 'team'
                    },
                    {
                        title: '操作',
                        key: 'action',
                        width: 150,
                        align: 'center',
                        render: (h, params) => {
                            return h('div', [
                                h('Button', {
                                    props: {
                                        type: 'primary',
                                        size: 'small',
                                        icon:'information-circled'
                                    },
                                    on: {
                                        click: () => {
                                            console.log(JSON.stringify(params));
                                            this.goToDetails(params);
                                        }
                                    }
                                }, '详情')
                            ])
                        }
                    }
                ],
                data2: [
                    {
                        name: '王小明',
                        result:'正常',
                        time : '2017-9-7',
                        team: '白班'
                    }
                ]
            }
        },
        methods: {
            /*/!*查看*!/
             select(selectData) {
             let i='';
             let j='';
             console.log(selectData);
             this.selectDataId = selectData[0].id;
             this.updateWord.project = selectData[0].project;
             this.updateWord.content = selectData[0].content;
             this.updateWord.result = selectData[0].result;
             this.updateWord.danger = selectData[0].danger;
             this.updateWord.measures = selectData[0].measures;
             this.updateWord.remarks = selectData[0].remarks;
             this.multipleDataId = [];
             for(i=0;i<selectData.length;i++) {
             this.multipleDataId.push(selectData[i].id);
             }
             console.log(this.multipleDataId);
             },
             /!*修改*!/
             update() {
             let params = {
             pid:this.selectedDataId,
             project:this.updateWord.project,
             content:this.updateWord.content,
             result:this.updateWord.result,
             danger:this.updateWord.danger,
             measures:this.updateWord.measures,
             remarks:this.updateWord.remarks,
             };
             api.fetchPost(api.path.findStationInfo,params).then((data) => {
             console.log(data);
             if (data.code == 10000) {
             this.$emit('hideLoading');
             this.loading = false;
             }else {
             this.$Message.error(data.msg);
             }
             }).catch(err => {
             this.$emit('hideLoading');
             this.$Message.error(err);
             })
             },*/
            goToAdd() {
                this.$router.push({path: `/routine/add`});
            },
            goToDetails(params) {
                this.$router.push({path: `/routine/details/${params.row.name}`});
            },
            changePage(num) {
                this.num = num;
                this.getList(this.size,num)
            },
            changeSize(size) {
                this.size = size;
                this.getList(size,this.num)
            },
            getList(size,num) {
                let params = {
                    pageSize:size,
                    pageStart:num,
                };
                api.fetchPost(api.path.routinePage,params).then((data) => {
                    if(data.code == 10000) {
                        this.$Message.error(data.msg);
                    }
                }).catch(err => {
                    this.$emit('hideLoading');
                    this.$Message.error(err);
                })
            }
        }
    }
</script>
